/* ==========================================================================
   Carpeen Landing Page — Stylesheet (Dark Theme)
   همه کلاس‌های این فایل با پیشوند carpeen- نام‌گذاری شده‌اند تا با CSS
   موجود پروژه Razor Pages تداخل ایجاد نکنند.
   تم بر اساس پالت آبی-نیوی تیره (Sky / Navy) بازطراحی شده است.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Design Tokens
   -------------------------------------------------------------------------- */
:root{
  /* رنگ برند - آبی آسمانی روی زمینه تیره */
  --cp-blue-700:#0D2A44;
  --cp-blue-600:#2A6AAA;
  --cp-blue-500:#4A9EE8;
  --cp-blue-400:#7EC8F0;
  --cp-blue-100:rgba(74,158,232,.16);
  --cp-blue-50:rgba(74,158,232,.08);

  --cp-navy-900:#0B0E13;
  --cp-navy-800:#141920;

  /* سطوح تیره (کارت‌ها و لایه‌ها) */
  --cp-surface:#141920;
  --cp-surface-2:#1A2130;
  --cp-badge-alt-bg:#223347;

  --cp-ink:#E4EEF8;
  --cp-ink-soft:#8AAEC8;
  --cp-ink-faint:#5B6E82;

  --cp-white:#FFFFFF;
  --cp-bg:#0F1319;
  --cp-bg-soft:#141920;
  --cp-bg-softer:#10151C;
  --cp-border:#1E3050;
  --cp-border-soft:#182437;

  --cp-success:#3DCC8E;
  --cp-success-bg:rgba(61,204,142,.14);
  --cp-warn:#E85A5A;

  /* تایپوگرافی */
  --cp-font:"Peyda","Vazirmatn",Tahoma,sans-serif;

  /* شعاع و سایه */
  --cp-r-sm:12px;
  --cp-r-md:16px;
  --cp-r-lg:20px;
  --cp-shadow-sm:0 1px 3px rgba(0,0,0,.35), 0 1px 2px rgba(0,0,0,.25);
  --cp-shadow-md:0 14px 32px -10px rgba(0,0,0,.55);
  --cp-shadow-lg:0 30px 70px -20px rgba(0,0,0,.65);

  /* لایه‌بندی */
  --cp-container:1200px;
  --cp-nav-h:76px;
  --cp-ease:cubic-bezier(.16,1,.3,1);
}

/* --------------------------------------------------------------------------
   2. Reset / Base
   -------------------------------------------------------------------------- */
.carpeen-root{
  font-family:var(--cp-font);
  color:var(--cp-ink);
  background:var(--cp-bg);
  direction:rtl;
  text-align:right;
  line-height:1.75;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

.carpeen-root *,
.carpeen-root *::before,
.carpeen-root *::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

.carpeen-root img{max-width:100%;display:block}
.carpeen-root a{color:inherit;text-decoration:none}
.carpeen-root ul{list-style:none}
.carpeen-root button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
.carpeen-root svg{flex-shrink:0}

.carpeen-root :focus-visible{
  outline:2px solid var(--cp-blue-500);
  outline-offset:3px;
  border-radius:6px;
}

@media (prefers-reduced-motion:reduce){
  .carpeen-root *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

.carpeen-container{
  width:100%;
  max-width:var(--cp-container);
  margin-inline:auto;
  padding-inline:24px;
}

.carpeen-section{padding-block:96px}
@media (max-width:900px){ .carpeen-section{padding-block:64px} }

.carpeen-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--cp-blue-400);
  font-size:14px;
  font-weight:600;
  margin-bottom:14px;
}
.carpeen-eyebrow::before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:var(--cp-blue-500);
  box-shadow:0 0 8px 1px rgba(74,158,232,.7);
}

.carpeen-section-head{
  max-width:640px;
  margin-bottom:52px;
}
.carpeen-section-head.carpeen-center{margin-inline:auto;text-align:center}

.carpeen-h2 {
    font-size: clamp(26px,3.4vw,38px);
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: -.01em;
    font-family: "yekan";
    color: var(--cp-ink);
}
.carpeen-lead {
    margin-top: 14px;
    font-size: 17px;
    color: var(--cp-ink-soft);
    line-height: 1.9;
    font-family: "yekan";
}

.carpeen-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 700;
    font-size: 15px;
    padding: 14px 26px;
    border-radius: 12px;
    transition: transform .18s var(--cp-ease), box-shadow .18s var(--cp-ease), background .18s var(--cp-ease), border-color .18s var(--cp-ease), color .18s var(--cp-ease);
    white-space: nowrap;
    text-decoration: none;
    font-family: "Peyda-Regular";
}
.carpeen-btn-primary{
  background:linear-gradient(180deg,var(--cp-blue-500),var(--cp-blue-600));
  color:#071322;
  box-shadow:0 10px 24px -8px rgba(74,158,232,.5);
}
.carpeen-btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px -8px rgba(74,158,232,.6);background:linear-gradient(180deg,var(--cp-blue-400),var(--cp-blue-500))}
.carpeen-btn-secondary{
  background:var(--cp-surface);
  color:var(--cp-ink);
  border:1.5px solid var(--cp-border);
}
.carpeen-btn-secondary:hover{border-color:var(--cp-blue-500);color:var(--cp-blue-400);transform:translateY(-2px)}
.carpeen-btn-ghost{
  background:var(--cp-blue-50);
  color:var(--cp-blue-400);
}
.carpeen-btn-ghost:hover{background:var(--cp-blue-100)}
.carpeen-btn-block{width:100%}

/* --------------------------------------------------------------------------
   3. Navbar
   -------------------------------------------------------------------------- */
.carpeen-nav{
  position:sticky;
  top:0;
  z-index:100;
  height:var(--cp-nav-h);
  display:flex;
  align-items:center;
  background:rgba(15,19,25,.7);
  border-bottom:1px solid transparent;
  transition:background .3s var(--cp-ease), box-shadow .3s var(--cp-ease), border-color .3s var(--cp-ease);
}
.carpeen-nav.carpeen-nav-scrolled{
  background:rgba(15,19,25,.92);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom-color:var(--cp-border-soft);
  box-shadow:0 6px 24px -12px rgba(0,0,0,.5);
}
.carpeen-nav-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  width:100%;
}
.carpeen-logo{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  font-size:20px;
  color:var(--cp-ink);
}
.carpeen-logo-mark{
  width:36px;height:36px;
  border-radius:10px;
  background:linear-gradient(160deg,var(--cp-blue-500),var(--cp-blue-700));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:17px;font-weight:800;
  box-shadow:0 6px 16px -4px rgba(74,158,232,.55);
}

.carpeen-nav-links{
  display:flex;
  align-items:center;
  gap:6px;
}
.carpeen-nav-links a{
  padding:10px 14px;
  border-radius:10px;
  font-size:15px;
  font-weight:600;
  color:var(--cp-ink-soft);
  transition:color .18s, background .18s;
}
.carpeen-nav-links a:hover{color:var(--cp-blue-400);background:var(--cp-blue-50)}

.carpeen-nav-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.carpeen-nav-actions .carpeen-btn{padding:11px 20px;font-size:14px}

.carpeen-hamburger{
  display:none;
  width:44px;height:44px;
  border-radius:10px;
  align-items:center;justify-content:center;
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
}
.carpeen-hamburger span{
  position:relative;
  width:18px;height:2px;background:var(--cp-ink);
  display:block;
  transition:transform .25s var(--cp-ease), opacity .25s var(--cp-ease);
}
.carpeen-hamburger span::before,
.carpeen-hamburger span::after{
  content:"";position:absolute;right:0;width:18px;height:2px;background:var(--cp-ink);
  transition:transform .25s var(--cp-ease), top .25s var(--cp-ease);
}
.carpeen-hamburger span::before{top:-6px}
.carpeen-hamburger span::after{top:6px}
.carpeen-hamburger[aria-expanded="true"] span{background:transparent}
.carpeen-hamburger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.carpeen-hamburger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

@media (max-width:960px){
  .carpeen-nav-links{display:none}
  .carpeen-nav-actions{display:none}
  .carpeen-hamburger{display:flex}
}

/* --------------------------------------------------------------------------
   4. Mobile Menu
   -------------------------------------------------------------------------- */
.carpeen-mobile-menu{
  position:fixed;
  inset:0;
  z-index:200;
  visibility:hidden;
  pointer-events:none;
}
.carpeen-mobile-menu.carpeen-open{visibility:visible;pointer-events:auto}

.carpeen-mobile-backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.6);
  opacity:0;
  transition:opacity .28s var(--cp-ease);
}
.carpeen-mobile-menu.carpeen-open .carpeen-mobile-backdrop{opacity:1}

.carpeen-mobile-panel{
  position:absolute;
  top:0;right:0;bottom:0;
  width:min(400px,88vw);
  background:var(--cp-surface-2);
  box-shadow:-20px 0 50px rgba(0,0,0,.5);
  border-left:1px solid var(--cp-border-soft);
  transform:translateX(105%);
  transition:transform .32s var(--cp-ease);
  display:flex;flex-direction:column;
  overflow-y:auto;
}
.carpeen-mobile-menu.carpeen-open .carpeen-mobile-panel{transform:translateX(0)}

.carpeen-mobile-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px;
  border-bottom:1px solid var(--cp-border-soft);
}
.carpeen-mobile-close{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--cp-border);
  color:var(--cp-ink-soft);
}

.carpeen-mobile-body{padding:20px;display:flex;flex-direction:column;gap:24px}

.carpeen-mobile-actions-title{
  font-size:13px;font-weight:700;color:var(--cp-ink-faint);
  margin-bottom:12px;
}

.carpeen-action-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.carpeen-action-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  padding:16px 14px;
  border-radius:var(--cp-r-md);
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
  min-height:112px;
  transition:transform .18s var(--cp-ease), border-color .18s var(--cp-ease), background .18s var(--cp-ease);
}
.carpeen-action-card:active{transform:scale(.97)}
.carpeen-action-card:hover{border-color:var(--cp-blue-500);background:var(--cp-blue-50)}
.carpeen-action-icon{
  width:38px;height:38px;border-radius:10px;
  background:var(--cp-surface-2);
  border:1px solid var(--cp-border);
  display:flex;align-items:center;justify-content:center;
  color:var(--cp-blue-400);
  font-size:17px;
}
.carpeen-action-title{font-size:14.5px;font-weight:700;color:var(--cp-ink)}
.carpeen-action-desc{font-size:12.5px;color:var(--cp-ink-faint);line-height:1.5}

.carpeen-mobile-links{
  display:flex;flex-direction:column;
  border-top:1px solid var(--cp-border-soft);
  padding-top:16px;
}
.carpeen-mobile-links a{
  padding:14px 4px;
  font-size:15px;font-weight:600;
  color:var(--cp-ink-soft);
  border-bottom:1px solid var(--cp-border-soft);
}
.carpeen-mobile-links a:hover{color:var(--cp-blue-400)}
.carpeen-mobile-links a:last-child{border-bottom:none}

.carpeen-mobile-cta{
  margin-top:auto;
  padding:20px;
  border-top:1px solid var(--cp-border-soft);
  display:flex;flex-direction:column;gap:10px;
}

/* --------------------------------------------------------------------------
   5. Hero
   -------------------------------------------------------------------------- */
.carpeen-hero{
  position:relative;
  padding-block:64px 40px;
  overflow:hidden;
}
.carpeen-hero::before{
  content:"";
  position:absolute;
  inset-inline-start:-10%;
  top:-160px;
  width:640px;height:640px;
  background:radial-gradient(closest-side, var(--cp-blue-100), transparent);
  z-index:0;
}
.carpeen-hero-inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:56px;
  align-items:center;
}
@media (max-width:980px){
  .carpeen-hero-inner{grid-template-columns:1fr;gap:44px}
}

.carpeen-hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;
  border-radius:100px;
  background:var(--cp-blue-50);
  color:var(--cp-blue-400);
  font-size:13.5px;font-weight:700;
  border:1px solid var(--cp-blue-100);
  margin-bottom:22px;
}

.carpeen-hero-title {
    font-size: clamp(30px,4vw,44px);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -.015em;
    color: var(--cp-ink);
    font-family: "Peyda-Regular";
}
    .carpeen-hero-title span {
        color: var(--cp-blue-400);
        font-family: "yekan";
        font-size: clamp(22px,3vw,40px);
    }

.carpeen-hero-sub {
    margin-top: 22px;
    font-size: 15px;
    color: var(--cp-ink-soft);
    line-height: 1.9;
    font-family: "samim";
}
.carpeen-hero-note{
  margin-top:12px;
  font-size:15px;
  color:var(--cp-ink-faint);
  max-width:56ch;
}

.carpeen-hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:32px;
}
.carpeen-hero-cta .carpeen-btn{padding:16px 30px;font-size:16px}

.carpeen-quick-actions{
  margin-top:32px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
@media (max-width:640px){
  .carpeen-quick-actions{grid-template-columns:repeat(2,1fr)}
}
.carpeen-quick-action{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
  padding:14px 8px;
  border-radius:var(--cp-r-md);
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
  font-size:13px;font-weight:700;
  color:var(--cp-ink-soft);
  transition:border-color .18s, transform .18s, color .18s, box-shadow .18s;
}
.carpeen-quick-action:hover{
  border-color:var(--cp-blue-500);
  color:var(--cp-blue-400);
  transform:translateY(-3px);
  box-shadow:var(--cp-shadow-sm);
}
.carpeen-quick-action i{font-size:19px;color:var(--cp-blue-500)}

/* Hero visual */
.carpeen-hero-visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:480px;
}
.carpeen-phone-frame{
  position:relative;
  width:min(300px,72vw);
  border-radius:38px;
  padding:14px;
  background:var(--cp-surface-2);
  border:2px solid var(--cp-border);
  box-shadow:var(--cp-shadow-lg);
}
.carpeen-phone-screen{
  border-radius:26px;
  overflow:hidden;
  background:var(--cp-bg);
  aspect-ratio:9/18.5;
}
.carpeen-phone-screen img{width:100%;height:100%;object-fit:cover}
.carpeen-phone-fallback{
  width:100%;height:100%;
  display:flex;flex-direction:column;
  padding:22px 16px;
  gap:14px;
  background:linear-gradient(180deg,rgba(74,158,232,.1),var(--cp-bg));
}
.carpeen-phone-fallback .carpeen-skel{
  border-radius:10px;background:var(--cp-surface);border:1px solid var(--cp-border);
}

.carpeen-float-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 14px;
    background: var(--cp-surface);
    border: 1px solid var(--cp-border-soft);
    box-shadow: var(--cp-shadow-md);
    font-size: 13.5px;
    font-weight: 700;
    color: var(--cp-ink);
    animation: carpeen-float 5s ease-in-out infinite;
    font-family: "samim";
    direction:rtl;
}
.carpeen-float-card i{color:var(--cp-blue-400);font-size:16px}
.carpeen-float-1{top:6%;right:3%;animation-delay:0s}
.carpeen-float-2{bottom:20%;right:2%;animation-delay:.6s}
.carpeen-float-3{top:32%;left:7%;animation-delay:1.1s}
.carpeen-float-4{bottom:4%;left:5%;animation-delay:1.6s}
@media (max-width:640px){
  .carpeen-float-card{font-size:11.5px;padding:9px 12px}
  .carpeen-float-1{right:-2%}
  .carpeen-float-3{left:-2%}
  .carpeen-float-4{left:0}
}
@keyframes carpeen-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}

/* --------------------------------------------------------------------------
   6. Trust strip
   -------------------------------------------------------------------------- */
.carpeen-trust{
  padding-block:36px;
  border-block:1px solid var(--cp-border-soft);
  background:var(--cp-bg-softer);
}
.carpeen-trust-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.carpeen-trust-text{
  font-size:15px;font-weight:600;color:var(--cp-ink-soft);
}
.carpeen-trust-stat{
  display:flex;align-items:baseline;gap:8px;
}
.carpeen-trust-stat b{font-size:28px;color:var(--cp-blue-400);font-weight:800}
.carpeen-trust-stat span{font-size:14px;color:var(--cp-ink-faint);font-weight:600}

/* --------------------------------------------------------------------------
   7. Features
   -------------------------------------------------------------------------- */
.carpeen-features-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
@media (max-width:960px){ .carpeen-features-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .carpeen-features-grid{grid-template-columns:1fr} }

.carpeen-feature-card{
  padding:26px 22px;
  border-radius:var(--cp-r-lg);
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
  transition:transform .22s var(--cp-ease), box-shadow .22s var(--cp-ease), border-color .22s var(--cp-ease);
}
.carpeen-feature-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--cp-shadow-md);
  border-color:rgba(74,158,232,.4);
}
.carpeen-feature-icon{
  width:46px;height:46px;
  border-radius:12px;
  background:var(--cp-blue-50);
  color:var(--cp-blue-400);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;
  margin-bottom:16px;
}
.carpeen-feature-title{font-size:17px;font-weight:700;margin-bottom:8px;color:var(--cp-ink)}
.carpeen-feature-desc{font-size:14.5px;color:var(--cp-ink-soft);line-height:1.85}

/* --------------------------------------------------------------------------
   8. Customer value
   -------------------------------------------------------------------------- */
.carpeen-value-section{background:var(--cp-bg-soft)}
.carpeen-value-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
@media (max-width:960px){ .carpeen-value-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .carpeen-value-grid{grid-template-columns:1fr} }
.carpeen-value-card{
  padding:24px 20px;
  border-radius:var(--cp-r-lg);
  background:var(--cp-surface-2);
  border:1px solid var(--cp-border);
}
.carpeen-value-card i{
  color:var(--cp-blue-400);
  font-size:20px;
  margin-bottom:14px;
  display:block;
}
.carpeen-value-title{font-weight:700;font-size:15.5px;margin-bottom:8px;color:var(--cp-ink)}
.carpeen-value-desc{font-size:14px;color:var(--cp-ink-soft);line-height:1.8}

/* --------------------------------------------------------------------------
   9. How it works
   -------------------------------------------------------------------------- */
.carpeen-steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  position:relative;
}
@media (max-width:900px){
  .carpeen-steps{grid-template-columns:1fr;gap:18px}
}
.carpeen-step{
  position:relative;
  padding:28px 22px 22px;
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
}
.carpeen-steps .carpeen-step:first-child{border-radius:var(--cp-r-lg) 0 0 var(--cp-r-lg)}
.carpeen-steps .carpeen-step:last-child{border-radius:0 var(--cp-r-lg) var(--cp-r-lg) 0}
[dir="rtl"] .carpeen-steps .carpeen-step:first-child{border-radius:0 var(--cp-r-lg) var(--cp-r-lg) 0}
[dir="rtl"] .carpeen-steps .carpeen-step:last-child{border-radius:var(--cp-r-lg) 0 0 var(--cp-r-lg)}
.carpeen-steps .carpeen-step + .carpeen-step{border-right:none}
[dir="rtl"] .carpeen-steps .carpeen-step + .carpeen-step{border-right:1px solid var(--cp-border);border-left:none}
@media (max-width:900px){
  .carpeen-steps .carpeen-step{border-radius:var(--cp-r-lg)!important;border:1px solid var(--cp-border)!important}
}
.carpeen-step-num{
  width:34px;height:34px;
  border-radius:10px;
  background:var(--cp-blue-600);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;
  margin-bottom:16px;
}
.carpeen-step-title{font-weight:700;font-size:15.5px;margin-bottom:8px;color:var(--cp-ink)}
.carpeen-step-desc{font-size:13.5px;color:var(--cp-ink-soft);line-height:1.8}

/* --------------------------------------------------------------------------
   10. Pricing
   -------------------------------------------------------------------------- */
/*.carpeen-pricing-section{background:var(--cp-bg-soft)}*/

.carpeen-pricing-section {
    padding: 100px max(48px, calc((100vw - var(--max-w)) / 2));
    background: var(--bg2);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    position: relative;
    overflow: hidden;
}

    .carpeen-pricing-section::before {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
        background-image: repeating-linear-gradient(45deg,transparent 0,transparent 119px,rgba(74,158,232,.35) 119px,rgba(74,158,232,.35) 120px), repeating-linear-gradient(-45deg,transparent 0,transparent 119px,rgba(74,158,232,.35) 119px,rgba(74,158,232,.35) 120px);
        -webkit-mask-image: radial-gradient(ellipse 100% 100% at 100% 100%,#000 0%,transparent 70%);
        mask-image: radial-gradient(ellipse 100% 100% at 100% 100%,#000 0%,transparent 70%);
        pointer-events: none;
        z-index: 0;
    }

    .carpeen-pricing-section > * {
        position: relative;
        z-index: 1
    }




.carpeen-billing-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin:0 auto 48px;
}
.carpeen-toggle-label {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--cp-ink-faint);
    font-family: "Peyda-Regular";
}
    .carpeen-toggle-label.carpeen-active {
        color: var(--cp-ink);
        font-family: "Peyda-Regular";
    }
.carpeen-toggle-switch{
  width:52px;height:30px;
  border-radius:100px;
  background:var(--cp-blue-100);
  position:relative;
  border:1px solid var(--cp-blue-100);
}
.carpeen-toggle-switch::after{
  content:"";
  position:absolute;
  top:3px;right:3px;
  width:22px;height:22px;
  border-radius:50%;
  background:var(--cp-blue-500);
  transition:transform .25s var(--cp-ease);
}
.carpeen-toggle-switch.carpeen-yearly::after{transform:translateX(-22px)}
.carpeen-toggle-save {
    font-size: 12.5px;
    font-weight: 700;
    font-family: "Samim";
    color: var(--cp-success);
    background: var(--cp-success-bg);
    padding: 4px 10px;
    border-radius: 100px;
}

.carpeen-pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  align-items:stretch;
}
@media (max-width:980px){ .carpeen-pricing-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto} }

.carpeen-price-card{
  position:relative;
  display:flex;
  flex-direction:column;
  padding:30px 26px;
  border-radius:22px;
  background:var(--cp-surface);
  border:1px solid var(--cp-border);
}
.carpeen-price-card.carpeen-featured{
  border-color:var(--cp-blue-500);
  box-shadow:0 30px 70px -20px rgba(74,158,232,.3), var(--cp-shadow-lg);
  transform:translateY(-8px);
}
@media (max-width:980px){ .carpeen-price-card.carpeen-featured{transform:none} }

.carpeen-price-badge {
    position: absolute;
    top: -14px;
    right: 26px;
    padding: 6px 14px;
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 700;
    background: var(--cp-blue-500);
    color: #071322;
    font-family: "Samim";
}
.carpeen-price-badge.carpeen-badge-alt{
  background:var(--cp-badge-alt-bg);
  color:var(--cp-ink);
  border:1px solid var(--cp-border);
}

.carpeen-price-plan {
    font-size: 15px;
    font-weight: 700;
    color: var(--cp-blue-400);
    margin-bottom: 6px;
    font-family: "Peyda-Regular";
}
.carpeen-price-title {
    font-size: 19px;
    font-weight: 800;
    margin-bottom: 6px;
    color: var(--cp-ink);
    font-family: "Peyda-Regular";
}
.carpeen-price-fit {
    font-size: 13.5px;
    color: var(--cp-ink-faint);
    margin-bottom: 20px;
    font-family: "Peyda-Regular";
}

.carpeen-price-amount {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 4px;
    font-family: "Samim";
}
.carpeen-price-amount b{font-size:32px;font-weight:800;color:var(--cp-ink)}
.carpeen-price-amount span{font-size:13.5px;color:var(--cp-ink-faint);font-weight:600}
.carpeen-price-yearly {
    font-size: 13px;
    color: var(--cp-ink-faint);
    margin-bottom: 24px;
    font-family: "Samim";
}
.carpeen-price-yearly b{color:var(--cp-ink-soft);font-weight:700}

.carpeen-price-list {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin-bottom: 24px;
    font-family: "PeydaWeb-Medium";
    flex: 1;
}
.carpeen-price-list li{
  display:flex;align-items:flex-start;gap:9px;
  font-size:13.5px;color:var(--cp-ink-soft);line-height:1.6;
}
.carpeen-price-list li i{color:var(--cp-success);font-size:14px;margin-top:3px}
.carpeen-price-limits {
    margin-top: 2px;
    padding-top: 14px;
    border-top: 1px dashed var(--cp-border);
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: "samim";
}
.carpeen-price-limits li{
  display:flex;align-items:flex-start;gap:9px;
  font-size:12.5px;color:var(--cp-ink-faint);
}
.carpeen-price-limits li i{color:var(--cp-ink-faint);font-size:12px;margin-top:3px}

.carpeen-pricing-note {
    max-width: 640px;
    margin: 44px auto 0;
    text-align: center;
    font-family: "PeydaWeb-Medium";
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.carpeen-pricing-note p{font-size:13.5px;color:var(--cp-ink-faint)}

/* Mobile pricing accordion helper (compare) */
.carpeen-plan-compare-toggle{
  display:none;
  margin:28px auto 0;
}
@media (max-width:980px){
  .carpeen-plan-compare-toggle{display:inline-flex}
}

/* --------------------------------------------------------------------------
   11. Why Carpeen
   -------------------------------------------------------------------------- */
.carpeen-why-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
@media (max-width:900px){ .carpeen-why-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .carpeen-why-grid{grid-template-columns:1fr} }
.carpeen-why-card{
  display:flex;
  gap:16px;
  padding:22px;
  border-radius:var(--cp-r-lg);
  border:1px solid var(--cp-border);
  background:var(--cp-surface);
}
.carpeen-why-icon{
  flex-shrink:0;
  width:44px;height:44px;
  border-radius:12px;
  background:linear-gradient(160deg,var(--cp-blue-500),var(--cp-blue-700));
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;
}
.carpeen-why-title {
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 6px;
    color: var(--cp-ink);
    font-family: "yekan";
}
.carpeen-why-desc {
    font-size: 13.5px;
    color: var(--cp-ink-soft);
    line-height: 1.8;
    font-family: "samim";
}

/* --------------------------------------------------------------------------
   12. FAQ
   -------------------------------------------------------------------------- */
.carpeen-faq-head-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.carpeen-faq-list{
  max-width:820px;
  margin-inline:auto;
  display:flex;flex-direction:column;
  gap:12px;
}
.carpeen-faq-item{
  border:1px solid var(--cp-border-soft);
  border-radius:14px;
  background:rgba(20,25,32,.5);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  overflow:hidden;
  transition:border-color .3s var(--cp-ease), background .3s var(--cp-ease);
}
.carpeen-faq-item.carpeen-open{border-color:var(--cp-border);background:rgba(20,25,32,.8)}
.carpeen-faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 20px;
  font-size:15px;
  font-weight:700;
  text-align:right;
  color:var(--cp-ink);
  transition:color .2s var(--cp-ease);
}
.carpeen-faq-q:hover{color:var(--cp-blue-400)}
.carpeen-faq-q i{
  flex-shrink:0;
  transition:transform .28s var(--cp-ease), color .2s var(--cp-ease);
  color:var(--cp-blue-500);
}
.carpeen-faq-item.carpeen-open .carpeen-faq-q i{transform:rotate(180deg)}
.carpeen-faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .32s var(--cp-ease);
}
.carpeen-faq-a-inner{
  padding:0 20px 18px;
  font-size:14px;
  color:var(--cp-ink-soft);
  line-height:1.85;
}

/* --------------------------------------------------------------------------
   13. Final CTA
   -------------------------------------------------------------------------- */
.carpeen-final-cta{
  border-radius:28px;
  background:linear-gradient(155deg,var(--cp-navy-900),var(--cp-blue-700));
  border:1px solid var(--cp-border);
  color:#fff;
  padding:64px 48px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.carpeen-final-cta::before{
  content:"";
  position:absolute;
  inset-inline-end:-120px;top:-120px;
  width:320px;height:320px;
  border-radius:50%;
  background:radial-gradient(closest-side, rgba(74,158,232,.28), transparent);
}
.carpeen-final-title {
    font-size: clamp(24px,3.6vw,34px);
    font-weight: 800;
    margin-bottom: 14px;
    font-family: "yekan";
}
.carpeen-final-sub {
    font-size: 16px;
    color: rgba(255,255,255,.75);
    max-width: 520px;
    margin-inline: auto;
    margin-bottom: 32px;
    font-family: "samim";
}
.carpeen-final-actions{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}
.carpeen-final-actions .carpeen-btn-primary{
  box-shadow:0 12px 28px -6px rgba(0,0,0,.5);
}
.carpeen-final-actions .carpeen-btn-secondary{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.22);
  color:#fff;
}
.carpeen-final-actions .carpeen-btn-secondary:hover{background:rgba(255,255,255,.14)}

@media (max-width:640px){
  .carpeen-final-cta{padding:44px 24px}
}

/* --------------------------------------------------------------------------
   14. Footer
   -------------------------------------------------------------------------- */
.carpeen-footer{
  background:var(--cp-navy-900);
  border-top:1px solid var(--cp-border-soft);
  color:rgba(255,255,255,.72);
  padding-top:72px;
}
.carpeen-footer-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:36px;
  padding-bottom:48px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
@media (max-width:900px){
  .carpeen-footer-top{grid-template-columns:1fr 1fr;gap:32px}
}
@media (max-width:560px){
  .carpeen-footer-top{grid-template-columns:1fr}
}
.carpeen-footer-brand .carpeen-logo{color:#fff}
.carpeen-footer-desc{
  margin-top:14px;
  font-size:13.5px;
  line-height:1.9;
  max-width:36ch;
  color:rgba(255,255,255,.55);
}
.carpeen-footer-social{
  display:flex;gap:10px;margin-top:20px;
}
.carpeen-footer-social a{
  width:38px;height:38px;border-radius:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;
  transition:background .18s, border-color .18s;
}
.carpeen-footer-social a:hover{background:rgba(255,255,255,.14);border-color:var(--cp-blue-500)}

.carpeen-footer-col-title{
  font-size:14px;font-weight:700;color:#fff;margin-bottom:18px;
}
.carpeen-footer-col ul{display:flex;flex-direction:column;gap:12px}
.carpeen-footer-col a{font-size:13.5px;color:rgba(255,255,255,.6);transition:color .18s}
.carpeen-footer-col a:hover{color:var(--cp-blue-400)}
.carpeen-footer-col li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:rgba(255,255,255,.6)}
.carpeen-footer-col li i{color:rgba(255,255,255,.4);font-size:13px}

.carpeen-footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  padding-block:26px;
  font-size:12.5px;
  color:rgba(255,255,255,.45);
}
.carpeen-footer-badges{
  display:flex;align-items:center;gap:14px;
  flex-wrap:wrap;
}
.carpeen-footer-badges img{
  height:52px;border-radius:8px;
  background:#fff;padding:4px;
}
.carpeen-footer-exon{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;color:rgba(255,255,255,.5);
}

/* --------------------------------------------------------------------------
   15. Reveal animation (intersection observer)
   -------------------------------------------------------------------------- */
.carpeen-reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .6s var(--cp-ease), transform .6s var(--cp-ease);
}
.carpeen-reveal.carpeen-in-view{
  opacity:1;
  transform:translateY(0);
}

/* --------------------------------------------------------------------------
   16. Utilities
   -------------------------------------------------------------------------- */
.carpeen-visually-hidden{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
.carpeen-no-scroll{overflow:hidden}